<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%
	String path = request.getContextPath();//获得项目的根目录，上下文路径
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<title>超市账单管理系统</title>
<link rel="stylesheet" href="css/public.css" />
<link rel="stylesheet" href="css/style.css" />
<script src="js/jquery.js"></script>
<link href="jquery-easyui-1.6.6/themes/default/easyui.css"
	rel="stylesheet">
<link href="jquery-easyui-1.6.6/themes/icon.css" rel="stylesheet">
<script type="text/javascript" src="jquery-easyui-1.6.6/jquery.min.js"></script>
<script type="text/javascript"
	src="jquery-easyui-1.6.6/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="jquery-easyui-1.6.6/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
	//2、测试用户编码是否唯一$.post()
	$(function() {
		$("#billCode").blur(function() {
			testBillCode($(this));
		});
		$("#productName").blur(function() {
			testProductName($(this));
		});
		$("#productDesc").blur(function() {
			testproductDesc($(this));
		});
		$("#productCount").blur(function() {
			testproductDesc($(this));
		});
		$("#totalPrice").blur(function() {
			testtotalPrice($(this));
		});
		$("#createdBy").blur(function() {
			testcreatedBy($(this));
		});
		$("#providerId").blur(function() {
			testproviderId($(this));
		});
		$("#submit").click(
				function() {
					var flag = testBillCode($("#billCode"))
							& testProductName($("#productName"))
							& testproductDesc($("#productDesc"))
							& testproductCount($("#productCount"))
							& testtotalPrice($("#totalPrice"))
							& testcreatedBy($("#createdBy"))
							& testproviderId($("#providerId"));

					if (flag == 0) {
						return false;
					}
					return true;
				});
		function testBillCode(t) {
			//1
			var v = t.val();
			var sp = t.next();
			var div = t.parent();
			sp.empty();
			$.ajaxSettings.async = false;//ajax同步
			var flag = false;
			//2
			$.post("testBillCode.html", {
				billCode : v
			}, function(res) {
				//如果占用返回false。否则其ture
				console.log(res);
				flag = res.result;
				if (v.length == 0) {
					sp.html("账单编码不能为空！！！");
					div.removeClass("ok").addClass("error");
					return false;
				} else if (!flag) {
					sp.html(v + "不可用");
					div.removeClass("ok").addClass("error");
					return false;
				} else {
					sp.html(v + "可用");
					div.removeClass("error").addClass("ok");
					return true;
				}

			}, "json");
			$.ajaxSettings.async = true;//ajax同步
			return flag;
		}
		//2、测试productName
		function testProductName(t) {
			var v = t.val();
			var sp = t.next();
			var div = t.parent();
			if (v.length == 0) {
				sp.html("商品名称不能为空！！！");
				div.removeClass("ok").addClass("error");
				return false;
			} else {
				sp.html("&radic;");
				div.removeClass("error").addClass("ok");
				return true;
			}

		}
		//3、测试productDesc
		function testproductDesc(t) {
			var v = t.val();
			var sp = t.next();
			var div = t.parent();
			if (v.length == 0) {
				sp.html("商品描述不能为空！");
				div.removeClass("ok").addClass("error");
				return false;
			} else {
				sp.html("&radic;");
				div.removeClass("error").addClass("ok");
				return true;
			}

		}
		//4、测试productCount
		function testproductCount(t) {
			var v = t.val();
			var sp = t.next();
			var div = t.parent();
			if (v.length == 0) {
				sp.html("商品数量不能为空！");
				div.removeClass("ok").addClass("error");
				return false;
			} else {
				sp.html("&radic;");
				div.removeClass("error").addClass("ok");
				return true;
			}

		}
		//5、测试totalPrice
		function testtotalPrice(t) {
			var v = t.val();
			var sp = t.next();
			var div = t.parent();
			if (v.length == 0) {
				sp.html("商品总额不能为空！");
				div.removeClass("ok").addClass("error");
				return false;
			} else {
				sp.html("&radic;");
				div.removeClass("error").addClass("ok");
				return true;
			}

		}
		//5、测试createdBy
		function testcreatedBy(t) {
			var v = t.val();
			var sp = t.next();
			var div = t.parent();
			if (v.length == 0) {
				sp.html("创建者不能为空！");
				div.removeClass("ok").addClass("error");
				return false;
			} else {
				sp.html("&radic;");
				div.removeClass("error").addClass("ok");
				return true;
			}

		}

		//6、测试providerId
		function testproviderId(t) {
			var v = t.val();
			var sp = t.next();
			var div = t.parent();
			if (v.length == 0) {
				sp.html("供应商ID不能为空！");
				div.removeClass("ok").addClass("error");
				return false;
			} else {
				sp.html("&radic;");
				div.removeClass("error").addClass("ok");
				return true;
			}

		}
		$(function() {
			$.post("getAllUnit.html", function(data) {
				var productUnit = $("#productUnit");
				productUnit.empty();
				$(data).each(
						function() {
							var option = "<option value='"+this.unitName+"'>"
									+ this.unitName + "</option>";
							productUnit.append(option);
						});
			}, "json");
		});
	});
</script>
</head>
<body>
	<!--头部-->
	<!-- <button id="btn">ajax</button> -->
	<header class="publicHeader">
		<h1>超市账单管理系统</h1>
		<div class="publicHeaderR">
			<p>
				<span>下午好！</span> <span style="color: #fff21b">
					${USER_LOGIN.userName }</span> , 欢迎你！
			</p>
			<a href="logOut.html">退出</a>
		</div>
	</header>
	<!--时间-->
	<section class="publicTime">
		<span id="time">2015年1月1日 11:11 星期一</span> <a href="#">温馨提示：为了能正常浏览，请使用高版本浏览器！（IE10+）</a>
	</section>
	<!--主体内容-->
	<section class="publicMian ">
		<div class="left">
			<h2 class="leftH2">
				<span class="span1"></span> 功能列表 <span></span>
			</h2>
			<nav>
				<ul class="list">
					<li id="active"><a href="billList.html">账单管理</a></li>
					<li><a href="providerList.ht">供应商管理</a></li>
					<li><a href="userList.html">用户管理</a></li>
					<li><a href="roleList.html">角色管理</a></li>
					<li><a href="password.html">密码修改</a></li>
					 <li><a href="goodsList.du">商品购买</a></li>
					<li><a href="logOut.html">退出系统</a></li>
				</ul>
			</nav>
		</div>
		<div class="right">
			<div class="location">
				<strong>你现在所在的位置是:</strong> <span>账单管理页面 >> 账单添加页面</span>
			</div>
			<div class="providerAdd">
				<!-- 执行文件上传必须是：post 、multipart/form-data -->
				<form action="doAddBill.html" method="post">
					<!--div的class 为error是验证错误，ok是验证成功-->
					<div>
						<label for="billCode">账单编号：</label> <input type="text"
							name="billCode" id="billCode" style="margin-left: 18px;"
							onkeyup="value=value.replace(/(^\s*)|(\s*$)/g,'')" /> <span></span>
					</div>
					<div>
						<label for="productName">商品名称：</label> <input type="text"
							name="productName" id="productName" style="margin-left: 18px;"
							onkeyup="value=value.replace(/(^\s*)|(\s*$)/g,'')" /> <span></span>
					</div>
					<div>
						<label for="productDesc">商品描述：</label> <input type="text"
							name="productDesc" id="productDesc" style="margin-left: 18px;"
							onkeyup="value=value.replace(/(^\s*)|(\s*$)/g,'')" /> <span></span>
					</div>
					<div>
						<label for="productUnit">商品单位：</label> <select name="productUnit"
							id="productUnit" style="margin-left: 18px; width: 272px;">
						</select>
					</div>
					<div>
						<label for="productCount">商品数量：</label> <input type="number"
							min="1" name="productCount" id="productCount"
							style="margin-left: 18px;"
							onkeyup="value=value.replace(/(^\s*)|(\s*$)/g,'')" /> <span></span>
					</div>
					<div>
						<label for="totalPrice">商品总额：</label> <input type="number" min="1"
							name="totalPrice" id="totalPrice" style="margin-left: 18px;"
							onkeyup="value=value.replace(/(^\s*)|(\s*$)/g,'')" /> <span></span>
					</div>
					<div>
						<label for="isPayment">是否支付：</label> <select name="isPayment"
							id="isPayment" style="width: 272px; margin-left: 18px;">
							<option value="1">未支付</option>
							<option value="2">已支付</option>
						</select>
					</div>
					<div>
						<label for="createdBy">创建者 ：</label> <input type="number" min="1"
							name="createdBy" id="createdBy" style="margin-left: 18px;"
							onkeyup="value=value.replace(/(^\s*)|(\s*$)/g,'')" /> <span></span>
					</div>
					<div>
						<label for="creationDate">创建时间：</label> <input name="creationDate"
							id="creationDate" class="easyui-datetimebox" editable="false"
							type="text" /> <span></span>
					</div>
					<div>
						<label for="providerId">供应商ID：</label> <input name="providerId"
							id="providerId" type="number" min="1" style="margin-left: 18px;"
							onkeyup="value=value.replace(/(^\s*)|(\s*$)/g,'')" /> <span></span>
					</div>
					<div class="providerAddBtn">
						<input type="submit" id="submit" style="padding: 0px;" /> <input
							type="reset" style="padding: 0px; width: 100px; font-size: 14px;" />
					</div>
				</form>
			</div>
		</div>
	</section>
	<footer class="footer"> 版权归北大青鸟 </footer>
	<script src="js/time.js"></script>
</body>
</html>